import kaboom from "https://unpkg.com/kaboom@next/dist/kaboom.mjs";

const k = kaboom({
    global: true,
    fullscreen: true,
    scale: 1,
    debug: true,
    clearColor: [0,0,0],
    background:[0,0,0,.5]
})

loadSprite('player','/sprites/player/player04.png')
scene("menu",()=>{
    add([
        text("Press Enter to Start",{
            width: width(),
            size: 60,
        }),
        pos(width()/4,height()/2)
    ])
    add([
        text("Simple Flappy",{
            width: width(),
            size:75
        }),
        pos(width()/3,height()/4)
    ])
    add([
        sprite("player"),
        scale(2),
        pos(width()/3-100,height()/4),
    ])
    keyPress("enter",()=>{
        go("game")
    })
})

keyPress("enter",()=>{
    go("game")
})

scene("game",()=>{
    const PIPE_OPEN = 240
    const PIPE_MIN = 60
    const JUMP_HEIGHT = 750
    const CEILING = -65

    let score = 0
    let SPEED = 320
    gravity(3200)

    layers([
        "bg",
        "obj",
        "ui"
    ],"obj")

    const player = add([
        sprite("player"),
        pos(width()/4-50,height()/4+50),
        scale(1.5),
        area(),
        body()
    ])

    player.action(()=>{
        if (player.pos.y>=height()||player.pos.y<=CEILING){
            go("lose",score)
        }
    })

    keyPress("space",()=>{
        player.jump(JUMP_HEIGHT)
    })

    mouseClick(()=>{
        player.jump(JUMP_HEIGHT)
    })

    function CreatePipe(){
        const h1 = rand(PIPE_MIN, height() - PIPE_MIN - PIPE_OPEN);
        const h2 = height() - h1 - PIPE_OPEN;
        add([
            pos(width(),0),
            rect(64,h1),
            color(0,127,255),
            outline(4),
            area(),
            move(LEFT,SPEED),
            cleanup(),
            "pipe"
        ]);
        add([
            pos(width(), h1 + PIPE_OPEN),
            rect(64, h2),
            color(0, 127, 255),
            outline(4),
            area(),
            move(LEFT, SPEED),
            cleanup(),
            // give it tags to easier define behaviors see below
            "pipe",
            // raw obj just assigns every field to the game obj
            { passed: false, },
        ])
    }

    player.collides("pipe",()=>{
        go("lose",score);
        addKaboom(player.pos)
    })

    action("pipe", (p) => {
        // check if bean passed the pipe
        if (p.pos.x + p.width <= player.pos.x && p.passed === false) {
            addScore();
            p.passed = true;
        }
    });

    loop(1,()=>{
        CreatePipe();
    })

    const scoreLabel = add([
        text("Your score: " +score),
        layer("ui"),
        origin("center"),
        pos(width()/2,80)
    ])

    function addScore(){
        score++
        scoreLabel.text = "Your score: " + score
        if(score%10===0){
            SPEED+=15
        }
    }
})

scene("lose",(score)=>{
    add([
        text("Game Over"),
        pos(width()/4 - 20,height()/4 + 50),
        scale(2)
    ])
    add([
        text('Your Score: ' + score),
        pos(width()/2,height()/3 - 100),
        scale(1),
        origin("center")
    ]);
    add([
        text('Press to Continue'),
        pos(width()/2,height()/3 + 300),
        color(0,255,255),
        scale(1),
        origin("center"),
    ])
    keyPress("space",()=>{
        go("game")
    })
    mouseClick(()=>{
        go("game")
    })
})


go("menu")





